import React from 'react';
import '../../static/topic/topicDetails.styl'
import Table from './tableList'
import axios from 'axios'
import {Modal, message, Spin} from 'antd';
import { connect } from 'react-redux'
import {exportId} from './../../actions/info'
import {load} from "../../actions/info";

const confirm = Modal.confirm;

@connect(
  state => state.inforesult,
  {exportId}
)

export default class PublicList extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      id: props.index,
      lists: [],
      totals: 0,
      current:1,
      amount:10,
      deleteList:[],
      selectedRowKeys: [],
      loaded:false
    }
  }
  // 默认状态显示列表
  thematicList = async () => {
    this.setState({
      loaded: false
    });
    let page = await
      axios.post('vrv-monitor-platform-web/data/query', {
        topicId: this.state.id,
        currentPage: 1,
        limit: 10,
        sortField:'poTime',
        sortType:''
      });
    if(page.data.statusCode === 200){
      this.setState(preState => ({
        lists: page.data.data,
        totals: page.data.totals,
        loaded: true
      }));
    }else{
      this.setState(prevState => ({
        loaded: true,
      }));
    }
  };
  componentDidMount() {
    this.thematicList()
  }
  // 点击跳转页面
  onChangecurrent=async(value)=>{
    this.setState({
      loaded: false
    });
    let page = await
      axios.post('vrv-monitor-platform-web/data/query', {
        topicId: this.state.id,
        currentPage: value,
        limit: this.state.amount,
        sortField:'poTime',
        sortType:''
      });
    this.setState(preState => ({
      lists: page.data.data,
      current:value,
      loaded: true
    }));
  };
  // 每页显示条数变化
  changeSize=async(value)=>{
    this.setState({
      loaded: false
    });
    let page = await
      axios.post('vrv-monitor-platform-web/data/query', {
        topicId: this.state.id,
        currentPage: this.state.current,
        limit: value,
        sortField:'poTime',
        sortType:''
      });
    this.setState(preState => ({
      lists: page.data.data,
      amount:value,
      loaded: true
    }));
  };
  // 复选框发生变化时的事件
  selectChange=(selectedRowKeys, selectedRows) => {
    let list=[];
    for(let i=0;i<selectedRows.length;i++){
      list.push(selectedRows[i].id)
    }
    this.setState(prevState=>({
      deleteList:list
    }));
    console.log(list)
    this.setState({selectedRowKeys});
    // console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
  };
  // 已阅按钮
  readingList(){
    if(this.state.deleteList.length>0){
      if(!localStorage.readTopic){
        localStorage.readTopic=JSON.stringify(["0"]);
      }
      let Hlist=JSON.parse(localStorage.readTopic);
      this.state.deleteList.forEach((item,i)=>{
        let isHas=Hlist.indexOf(item)>=0;
        if(!isHas){
          Hlist.push(item);
          localStorage.readTopic=JSON.stringify(Hlist)
        }
      });
      this.setState({
        selectedRowKeys:[]
      })
    }else{
      message.warning('请选择标记为已阅项');
    }
  }
  // 删除多个
  deleteMultiple(){
    if(this.state.deleteList.length>0){
      confirm({
        title: '提示',
        content: '确定删除吗',
        onOk: () => {
          this.deleteButton();
        },
        onCancel() {
        }
      })
    }else{
      message.warning('请选择删除项');
    }
  }
  // 批量删除事件
  deleteButton = async () => {
    this.state.deleteList.forEach(async(item) => {
      let res = await
        axios.post('vrv-monitor-platform-web/data/delete', {
          deleteIds: item
        });
      if (res.data.statusCode === 200) {
        this.setState(prevState => ({
          lists: prevState.lists.filter(items => {
            return items.id !== item
          })
        }));
        message.success('删除成功');
        this.setState({
          selectedRowKeys:[]
        })
      } else {
        message.error(res.data.message);
      }
    });
  };
  tableAction=(actionKey, index,title,content,poTime,webSite,domain,effect)=>{
    if (actionKey === "删除") {
      confirm({
        title: '提示',
        content: '确定删除吗',
        onOk: ()=>{
          this.deleteList(index);
        },
      })
    } else if (actionKey === "收藏") {
      this.addCollected(index,title,content,poTime,webSite,domain,effect);
    }else if(actionKey === "已收藏"){
      this.deleteCollected(index);
    } else if (actionKey === "上报") {
      this.reported(index,title,content);
    }
  };
  // 单个上报事件
  reported = async (index,title,content) => {
    let res = await
      axios.post('vrv-monitor-platform-web/popularfeelingsDispose/insert', {
        popularfeelingsId:index,
        popularfeelingsTitle:title,
        popularfeelingsContent:content
      });
    if (res.data.statusCode === 200) {
      message.success('上报成功');
    } else {
      message.error(res.data.message);
    }
  };
  // 单个添加收藏事件
  addCollected = async ( index,title,content,poTime,webSite,domain,effect) => {
    console.log(index,title,content,poTime,webSite,domain,effect);
    let res = await
      axios.post('vrv-monitor-platform-web/collection/insert', {
        favoriteId: index,
        title:title,
        content:content,
        poTime:poTime,
        webSite:webSite,
        domain:domain,
        positiveOrNegative:effect
      });
    if (res.data.statusCode === 200) {
      message.success('收藏成功');
    } else {
      message.error(res.data.message);
    }
  };
  // 单个收藏取消事件
  deleteCollected = async (index) => {
    console.log(index);
    let res = await
      axios.post('vrv-monitor-platform-web/collection/delete', {
        ids: index,
      });
    if (res.data.statusCode === 200) {
      message.success('取消成功');
    } else {
      message.error(res.data.message);
    }
  };
  // 单个删除事件
  deleteList = async (index) => {
    let res = await
      axios.post('vrv-monitor-platform-web/data/delete', {
        deleteIds: index
      });
    if (res.data.statusCode === 200) {
      this.setState(prevState => ({
        lists: prevState.lists.filter(item => {
          return item.id !== index
        })
      }));
      message.success('删除成功');
    } else {
      message.error(res.data.message);
    }
  };
  // 导出
  exportInfo(){
    if(this.state.deleteList.length>0){
      let sp=this.state.deleteList;
      this.props.exportId(sp)
    }else{
      message.warning('请选择导出项');
    }
  }
  render() {
    const {selectedRowKeys} = this.state;
    const rowSelection = {
      selectedRowKeys,
      onChange: this.selectChange
    };
    return (
      <div className="table">
        {
          this.state.loaded?
            <Table
              click={this.tableAction}
              data={this.state.lists}
              rowSelection={rowSelection}
              deleteMultiple={()=>this.deleteMultiple()}
              readingList={()=>this.readingList()}
              exportInfo={()=>this.exportInfo()}
              changeSize={(value)=>this.changeSize(value)}//每页显示条数
              total={this.state.totals}
              pageSize={this.state.amount}
              currentIndeX={this.state.current}
              onChange={(currentpage)=>this.onChangecurrent(currentpage)}//当前页变化
            ></Table>:
            <div style={{display:'flex',justifyContent:'center',alignItems:'center',height:200}}>
              <Spin size="large"/>
            </div>
        }

      </div>
    );
  }
}